<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>充值中心</title>
<link rel="stylesheet" href="${base}/static/media/css/bootstrap.css" />
<script src="${base}/static/index/vendor/jquery/jquery.min.js"></script>
<script src="${base}/static/index/vendor/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" charset="utf-8"
	src="${base }/static/vendor/bootstrapPager/bootstrapPager.js"></script>
<script type="text/javascript" charset="utf-8"
	src="${base }/static/js/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript" charset="utf-8" src="${base }/static/js/layer/layer.js"></script>
<link href="${base }/static/css/base.css" rel="stylesheet"
	type="text/css" />
<link rel="stylesheet" type="text/css"
	href="${base }/static/css/help.css" />
<script type="text/javascript"
	src="${base }/static/js/jquery-1.8.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(e) {
    $(".fwmc_xxk li").click(function(){
		$(this).addClass("on").siblings().removeClass("on");
			//tola();
			//alert($(this).children("i").html());
			//$("input[name=prices]").val()
			var price = $(this).children("i").html();
			$("input[name=prices]").val(price);
		});
    
	/* //加
	$(".jia").click(function(){
		var fw_numb = $(".srkk").val();	
		fw_numb++;
		$(".srkk").val(fw_numb);		
		})
	//减
	$(".jian").click(function(){
		var fw_numb = $(".srkk").val();	
		if(fw_numb <= 1){
			alert("数量不足了，请住手！")
			}else{
		fw_numb--;
		$(".srkk").val(fw_numb);		
			}
		tola();
		})	 */
});

function tola(){
		var $li = $(".fwmc_xxk").children("li.on");
		var money = $li.children("i").text();
		var count = $(".srkk").val();
		
		alert(count);
		$(".zwfb_zje span").text(money*count);
		
}

function sumbits(){
		var newString = $("#test_new_line").val().replace(/\n/g, ',').replace(/\r/g, ',');
		
	 	newString = newString.replace(/_#_@/g, '<br/>');//IE7-8
	    newString = newString.replace(/_@/g, '<br/>');//IE9、FF、chrome
	    newString = newString.replace(/\s/g, '&nbsp;');//空格处理
	    //alert(newString);
		$("input[name=cards]").val(newString); 
		
		var card_type=$("input[name=card_type]:checked").val();
		var cards = $("input[name=cards]").val();
		var prices = $("input[name=prices]").val();
		
		
		var str = new Array();
		str = cards.split(",");
		for(i=0;i<str.length;i++){
			if(card_type=='cnpc'){//中石油 9 16
				if(str[i].substr(0,1)!='9'||str[i].length!=16){
					layer.msg("卡号有误,中石油卡号以9开头，16位.");
					return false;
				}
			}
			if(card_type=='sinopec'){//中石化 100011 19
				if(str[i].substr(0,6)!='100011'||str[i].length!=19){
					layer.msg("卡号有误,中石化卡号以100011开头，19位.");
					return false;
				}
			}
		}
		var isCheck = true;
		//alert(card_type+";"+cards+";"+prices);
		if(card_type == ""){
			isCheck = false;
			layer.msg("请选择油卡类型");
			return false;
		}
		if(cards == ""||cards=="可输入多个油卡号码，号码间需用空格隔开"){
			isCheck = false;
			layer.msg("请输入卡号");
			return false;
		}
		if(prices == ""){
			isCheck = false;
			layer.msg("请选择充值金额");
			return false;
		}
		//alert(card_type+" "+cards+" "+prices);
		if(isCheck==true){
			$("#submit").hide();
			$("#showing").show();
			
			
			$.ajax({
	        	url:"${base }/business/recharges",
	            type:'post',
	            dataType:'json',
	            data:{"gasType":card_type,"cards":cards,"prices":prices},
	            success:function(res)
	            {
	            	//alert(123);
	                if(res.code==1){//成功
	                	layer.alert('充值成功', {icon: 1});
	                }else if(res.code==0){//失败
	                	layer.alert(res.msg, {icon: 5});
	                }else if(res.code==2){//成功，但有失败的
	                	layer.alert("充值成功,但有失败油卡号:"+res.data, {icon: 5});
	                }
	                $("#submit").show();
	    			$("#showing").hide();
	    			$("#test_new_line").val("");
	            }
	        });
		}
		return false;
}
</script>
</head>
<body style="background:#fff;">
	<div class="portlet-body">
		<form class="dataform" id="orderlist_form"
			 onsubmit="return sumbits()">
			<div class="row">
				<label class="col-md-1">卡类型：</label>
                <div class="col-md-4">
                	<input type="radio" name="card_type"  value="cnpc"/>&nbsp;中石油
                	&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" checked="checked" name="card_type" value="sinopec"/>&nbsp;中石化
                </div>
            </div>
            <div class="row" style="height:15px;"></div>
			<div class="row">
				<label class="col-md-1" style="float:left;">油卡号：</label>
				<div style="margin-left:18px;display: inline-block;float:left;">
					<textarea name="" id="test_new_line" cols="95" rows="10"></textarea>
					<input type="hidden" name="cards" />
				</div>
				<div class="col-md-4" style="float:left;">
					<p>批量充值说明：</p>
					<p>1，选择中石油时，卡号以9开始，共16位。选择中石化时，卡号以100011开始，共19位。 </p>
					<p>2，所输入面值需要上级已经对接相应面值的商品，否则商品匹配不成功，充值失败。</p>
					<p>3，每次最多可给100个号码充值。</p>
					<p>4，每行一个加油卡号</p>
				</div>
			</div>
			<div class="row" style="height:15px;"></div>
			<div class="row">
				<label class="col-md-1">充值金额：</label>
				<div style="width: 14%; height: 30px; display: inline-block;">
					<td><ul class="fwmc_xxk">
						<li class="on" name="price" value="1000">
								<p>金额</p> <i>1000</i>元
							</li>
							<li name="price" value="500">
								<p>金额</p> <i>500</i>元
							</li>
							<li name="price" value="200">
								<p>金额</p> <i>200</i>元
							</li>
						</ul>
					<input type="hidden" name="prices" value="1000"/>
					</td>
				</div>
			</div>
			<div class="row">
				<label class="col-md-1"></label>
				<div style="width: 14%; height: 30px; display: inline-block; margin-top: 30px">
					<input type="submit" id="submit" class="btn offline_serch_hide"
						style="margin-right: 30px; background: #18BC9C; color: #fff; border-color: #18BC9C;"
						value="充值">
					<input type="button" id="showing" class="btn offline_serch_hide"
						style="margin-right: 30px;display:none; background: #999; color: #fff; border-color: submit;"
						disabled="disabled" value="充值中。。。">
				</div>
			</div>
			<div style="width: 100%; height: 15px;"></div>
		</form>
	</div>
</body>
</html>